<template>
  <!-- 容器布局 -->
  <el-container class="home-container">
    <!-- 侧边栏 -->
    <CommonAside></CommonAside>
    <!-- 头部 -->
    <el-container>
      <CommonHeader></CommonHeader>
      <!-- 主页面 -->
      <el-main>
        <!-- 路由占位符 -->
        <router-view></router-view>
      </el-main>
      <!-- 尾部 -->
      <el-footer>
        <CommonFooter></CommonFooter>
      </el-footer>
    </el-container>
  </el-container>
</template>

<script>
import CommonAside from '@/components/common/Aside.vue'
import CommonHeader from '@/components/common/Header.vue'
import CommonFooter from '@/components/common/Footer.vue'
export default {
  name: "HomeView",
  components: {
    CommonAside,
    CommonHeader,
    CommonFooter,
  },
  data() {
    return {
      isCollapse: false,
      islogin: window.sessionStorage.getItem('userid'),
      username: window.sessionStorage.getItem('user'),
      input: '',
      select: ''
    };
  },
  methods: {
  },
};
</script>

<style scoped>
.home-container {
  height: 100%;
}
.el-main {
  background: #619ac3;
  box-shadow: inset 7px 7px 14px #24384b, inset -7px -7px 14px #90e0ff;
  background-image: url(@/assets/images/hair.png);
  background-size: 15% 20%;
  background-repeat: no-repeat;
  background-position: center;
}
.el-footer {
    border-top-left-radius: 0.2em;
    border-top-right-radius: 0.2em;
    background: #5a8cbb;
    box-shadow: inset -8px -8px 16px #2d465e, inset 0px 8px 16px #87d2ff;
}
.el-card__body, .el-footer {
    padding: 0px;
}
</style>
